<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
        <link rel="stylesheet" type="text/css" href="../css/index.css">
        <link rel="stylesheet" type="text/css" href="../css/join.css">
        <link rel="stylesheet" type="text/css" href="../dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.css">                
        <script  src="../dhtmlx/dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
        <script  src="../dhtmlx/dhtmlxGrid/codebase/dhtmlxgrid.js"></script>         
        <script  src="../dhtmlx/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
        <script  src="../dhtmlx/dhtmlxGrid/codebase/ext/dhtmlxgrid_splt.js"></script>
        <script  src="../dhtmlx/dhtmlxGrid/codebase/ext/dhtmlxgrid_drag.js"></script>
        <script  src="../dhtmlx/dhtmlxTreeGrid/codebase/dhtmlxtreegrid.js"></script>
        <script  src="../dhtmlx/dhtmlxGrid/codebase/ext/dhtmlxgrid_selection.js"></script>
        <script  src="../dhtmlx/dhtmlxGrid/codebase/ext/dhtmlxgrid_nxml.js"></script>
        <script  src="../dhtmlx/dhtmlxGrid/codebase/excells/dhtmlxgrid_excell_acheck.js"></script>
        <script  src="../dhtmlx/dhtmlxDataProcessor/codebase/dhtmlxdataprocessor.js"></script>
        <script  src="../dhtmlx/dhtmlxTreeGrid/codebase/excells/dhtmlxgrid_excell_calendar.js"></script>
        
        <script type="text/javascript">
        <!-- 
            function showaddForm(){
                if(document.getElementById('Div_PermissionGroup').style.display == 'none'){
                    document.getElementById('Div_PermissionGroup').style.display = 'block';    
                }else{
                    document.getElementById('Div_PermissionGroup').style.display = 'none';
                }
            
            }
            
            function Change(target,type){  
                if ( target.value == target.defaultValue && type==0) target.value = ''; 
                if ( !target.value && type==1) target.value = target.defaultValue; 
            }
            
            function deleteConfirm(){
                if(document.getElementById('selectedRowId').value == 1 || document.getElementById('selectedRowId').value == 2 || document.getElementById('selectedRowId').value == 3 || document.getElementById('selectedRowId').value == 4){
                    alert('기본 그룹은 삭제하실 수 없습니다.');    
                }else{
                    mygrid.deleteSelectedItem();
                    //alert("그룹이 삭제되었습니다.");    
                }
            }      
            
            function saveConfiguration(){
                myDataProcessor.sendData();
                alert("변경되었습니다.");
            }                           
        -->
        </script>      
    </head>
    <center>
    <body bgcolor="white" text="black" link="blue" vlink="purple" alink="red" onLoad="mygrid.setColumnHidden(0,true);">              
        <form name="Config_Code" method="POST" action=""> 
        <input type="hidden" name="selectedRowId">
        <table width="100%" align="center" border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td valign="top">
                    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
                        <tr>
                            <td background="../../images/join/notice_middleleft.gif">
                            </td>
                            <td valign="top">
                                <br>   
                                <table class="join_box" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">                       
                                    <tr height="30">
                                        <td align="center" width="80%" class="inputbox">
                                            <div id="Grid_Permission_Configuration" width="600" height="400" style="background-color:white;overflow:hidden"></div>
                                        </td>
                                        <td align="center" class="inputbox" valign="top">
                                            <p align="center">
                                                <br><br> 
                                                <input type="button" class="small" name="Del_PermissionGroup" value="그룹 모두 보기" onClick="mygrid.expandAll();">
                                                <br><br>
                                                <input type="button" class="small" name="Del_PermissionGroup" value="그룹 모두 닫기" onClick="mygrid.collapseAll();">
                                                <br><br><br><br>
                                                <input type="button" class="small" name="Add_PermissionGroup" value="카테고리 추가" onClick="showaddForm();">      
                                                <br><br>
                                                <div id="Div_PermissionGroup" style="display:none">
                                                    <input type="text" class="small" name="MainCategory_Name" value="메인 카테고리" onFocus='Change(this,0)' onBlur='Change(this,1)'>                            
                                                    <input type="text" class="small" name="SubCategory_Name" value="서브 카테고리" onFocus='Change(this,0)' onBlur='Change(this,1)'>                            
                                                    <br>
                                                    <input type="submit" class="tiny" value="등록">
                                                </div>
                                                <br>
                                                <br><br>
                                                <input type="button" class="small" onclick="saveConfiguration();" id="updatebutton" value="저장하기" style="display:inline;">
                                            </p>
                                        </td>
                                    </tr>                                                                                                                         
                                </table>
                            </td>
                        </tr>                                    
                    </table>   
                </td>
            </tr>
            <tr height="30">
                <td class="inputbox">
                    <p align="center">
                        
                    </p>
                <td>
            </tr> 
        </table>
        </form>
        <script>       
            // Row Open, Close 값 저장
            var openRowId = new Array();
            
            function selectedRowId(id){
                document.getElementById('selectedRowId').value = id;
                //alert(id);    
            }
            
            function doOnRowDblClicked(rowId,cellInd){                
                //기본 그룹 변경 불가
                if(cellInd == 1 && (rowId == 1 || rowId == 2 || rowId == 3 || rowId == 4)){
                    alert('기본 그룹명은 변경하실 수 없습니다.');        
                //하위 tree 열고 닫기
                }else if(cellInd == 2){
                    if(openRowId[rowId] == 1){
                        mygrid.closeItem(rowId);    
                        openRowId[rowId] = 0;
                    }else{
                        mygrid.openItem(rowId);
                        openRowId[rowId] = 1;
                    }
                }else{
                    return true;    
                }
            }
            
            function doOnCheck(rowId,cellInd,state){
                //alert(rowId + "." + cellInd + "." + state);
                return true;
            }
            
            mygrid = new dhtmlXGridObject('Grid_Permission_Configuration');
            mygrid.setImagePath("../dhtmlx/dhtmlxGrid/codebase/imgs/");
            mygrid.setSkin("mt");
            mygrid.selMultiRows = true;  
            
            mygrid.setHeader("No,카테고리,사용");
            mygrid.setInitWidths("50,400,200");
            mygrid.setColAlign("center,left,center");
            mygrid.setColTypes("ro,tree,acheck");
            mygrid.setColumnIds("GroupID,Category,Allow");
            mygrid.setColSorting("int,str,str");
            mygrid.setOnRowSelectHandler(selectedRowId);
            mygrid.setOnRowDblClickedHandler(doOnRowDblClicked);
            mygrid.setOnCheckHandler(doOnCheck);            
            //mygrid.lockRow(1,true);
            //mygrid.enableSmartXMLParsing(true);           
            mygrid.init();
            //mygrid.loadXML("Get_Code.php");
            
            
            //myDataProcessor = new dataProcessor("Update_Code.php");
            myDataProcessor.enableDataNames(true);
            myDataProcessor.setUpdateMode("off");
            myDataProcessor.setTransactionMode("POST");
            myDataProcessor.init(mygrid);
            
        </script>    
        </body>
    </center>
 </html>